import React from 'react'
import Code from './Code'
import TitleBar from '../ui-components/titleBar'
import style from './style'
import cx from 'classnames'

export default () => (
	<div className={cx({
		[style.root]: true
	})}>
		<Code>{'<TitleBar label={..}/>'}</Code>
		<div style={{width: '900px'}}>
			<TitleBar 
				add={{label: '新建模板', handler: () => {}}} 
				label='员工档案模板管理' 
				link={{label: '公司目标', handler: () => {}}}
				descr
			/>
		</div>
		<div style={{width: '900px'}}>
			<TitleBar 
				add={{label: '新建模板', handler: () => {}}} 
				label='员工档案模板管理' 
				descr
			/>
		</div>
		<div style={{width: '900px'}}>
			<TitleBar 
				link={{label: '公司目标', handler: () => {}}}
				label='员工档案模板管理' 
				descr
			/>
		</div>
		<div style={{width: '900px'}}>
			<TitleBar 
				label='员工档案模板管理' 
				back
			/>
		</div>
		<div style={{width: '900px'}}>
			<TitleBar 
				label='带 text 的标题' 
				text='员工档案模板管理' 
			/>
		</div>
		<div style={{width: '900px'}}>
			<TitleBar 
				label='带导航的标题' 
				nav={[{label:'one', link:'/peer'}, {label:'two',link:'/me'}]} 
			/>
		</div>
		<div style={{width: '900px'}}>
			<TitleBar 
				label='多按钮' 
				actions={[
					{
						label: '确定',
						handler: () => {}
					},
					{
						label: '去死',
						handler: () => {},
						blueLine: true
					}
				]}
			/>
		</div>
	</div>
)
